*{
	padding:0px;
	margin:0px;
}
div#box{
	height: 1rem;
	/*width: 1rem;*/
	overflow: hidden;
	position: relative;
	/*border: 1px solid red;*/
}
div article{
	overflow: hidden;
}
div article a{
	display: block;
	/*width: 1rem;*/
	height: 1rem;
	
	overflow: hidden;
	position: relative;
	text-decoration: none;
}
div article img{
	width:100%;
	height: 1rem;
}
div article .hidden{
	display: none;
}
div article .span{
	width: 100px;
	/*height: 80px;*/
	font-size: 18px;
	line-height: 30px;
	font-weight: 700;
	text-align: center;
}
div article .span1{
	border:1px solid gold;
	box-shadow: 1px 1px 3px 3px yellow;
	position: absolute;
	top:50%;
	color: red;
	animation: show1 2s linear;

}
@keyframes show1{
	from{
		transform: translate(0,0.5rem);
	}
	to{
		transform: translate(50,0.5rem);
	}
}

div article .span2{
	/*border:1px solid green;*/
	position: absolute;
	top:80%;
	left: 20%;
	color: gold;
	text-shadow:2px 3px 5px red;
	/*line-height: 1rem;*/
	font-size: 50px;
	animation: show2 2s linear 3;
}

@keyframes show2{
	from{
		transform: rotate(0deg);
	}
	to{
		transform: rotate(360deg);
	}
}

div article .span3{
	/*border:1px solid yellow;*/
	position: absolute;
	top:50%;
	right: 0px;
	color: yellow;
	text-shadow:3px 4px 10px red;
	animation: show3 3s linear;
}

@keyframes show3{
	from{
		transform: translate(0rem,0.5rem);
	}
	to{
		transform: translate(50,0.5rem);
	}
}

div article .span4{
	border:1px solid blue;
	position: absolute;
	top:0;
	right: 30%;
	color: blue;
	box-shadow: 1px 1px 3px 3px black;
	animation: show4 5s linear;
}

@keyframes show4{
	from{
		transform: translate(0,1rem);
	}
	to{
		transform: translate(50,0.5rem);
	}
}

div#mp3{
		width:30px;height:30px;
		background: #000000;
		color:#fff;
		border-radius: 50%;;
		position: absolute;
		top:10px;
		right:10px;
		text-align: center;
		line-height: 2.2em;
		animation: mp3 2s linear infinite;
		cursor: pointer;
	}
	/*播放状态停止*/
	div#mp3.stop{
		animation-play-state:paused;
	}
	@keyframes mp3{
		from{
			transform: rotate(0deg);
		}
		to{
			transform: rotate(360deg);
		}
	}
</style>









